<script setup>
	import { ref } from 'vue';
	import { loginService } from '../../api/login'
	import { useUserStore } from '../../store/idnex'
	import waterMarker from "../../components/sdq-watermarker/waterMarker.vue"
	import { getWatermar, getDisable } from '../../api/login.js'
	
	const watermarText = ref('')
	const isHide = ref(false)
	
	const disableObj = ref({
		data:{
			title:''
		}
	})
	const disabledialog = ref(null)
	const isDisable = ref(false)
	
	getDisable('bty').then(res => {
		disableObj.value = res
		if(res.data.disable){
			isDisable.value = true
			disabledialog.value.open()
		}
	})
	
	const tryClose = () => {
		disabledialog.value.open()
	}
	
	
	getWatermar().then(res => {
		if(!res.data.hide){
			watermarText.value = res.data.text
			isHide.value = true
		}
	})
	
	const username = ref('')
	const password = ref('')
	const userStore = useUserStore()
	
	const handleRegister = () => {
		uni.navigateTo({
			url:'/pages/index/register'
		})
	}
	
	const handleLogin = async () => {
		// 校验是不是空
		if(username.value == '' || password.value == ''){
			uni.showToast({
				title:'用户名或密码不能为空'
			})
			return false
		}
		const res = await loginService({username:username.value, password:password.value})
		if(res.code === 200){
			uni.hideToast()
			uni.showToast({
				title:'登录成功'
			})
			// 讲用户设置进入仓库中
			console.log(res);
			userStore.setUser(res.data)
			setTimeout(() => {
				uni.switchTab({
					url:'/pages/home/index'
				})
			}, 600)
		}


	}
	
</script>

<template>
	<view class="contaner">
		
		<uni-popup ref="disabledialog" type="dialog">
			<uni-popup-dialog type="error" cancelText=" " confirmText=" " :title="disableObj.data.title" :content="disableObj.data.text" @close="tryClose" @confirm="tryClose" :before-close="true" ></uni-popup-dialog>
		</uni-popup>
		
		<waterMarker v-if="isHide" col="4" row="8" :text="watermarText" opacity="0.1" color="black" rotate="-30deg"></waterMarker>
		
		
		<view class="img">
			<image src="../../static/images/bmi.png" mode="aspectFit"></image>
		</view>
		<view class="center">
			<view class="user-inp">
				<view class="user-inp-item">
					<uni-easyinput  prefixIcon="person" v-model="username" placeholder="请输入账号"></uni-easyinput>
				</view>
				<view class="user-inp-item">
					<uni-easyinput  type="password"  prefixIcon="locked" v-model="password" placeholder="请输入密码"></uni-easyinput>
				</view>
			</view>
			<button :disabled="isDisable" type="primary" @click="handleLogin">登录</button>
			<button :disabled="isDisable" @click="handleRegister" style="background-color: skyblue;">注册</button>
		</view>
	</view>

</template>

<style scoped lang="scss">
	.center {
		.user-inp {
			width: 90%;
			margin: 0 auto;
			margin-top: 20rpx;
			.user-inp-item {
				margin-top: 20rpx;
			}
		}
		margin-top: 80rpx;
		button {
			margin-top: 20rpx;
			width: 50%;
		}
	}
	.img {
		width: 100%;
		height: 400rpx;
	image {
		width: 100%;
		}
	}
</style>